// Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
// Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license

/**
 * @summary Initializes a toast container
 *
 * @name base
 * @selector .slds-notify_container
 * @restrict div
 * @support dev-ready
 * @variant
 */
.slds-notify-container,
.slds-notify_container {
  @include deprecate('4.0.0', '`notify-container` is deprecated, use `notify_container` instead.');
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  z-index: $z-index-toast;
  text-align: center;
}

/**
 * @summary Initializes toast notification
 * @selector .slds-notify_toast
 * @restrict .slds-notify_container div
 */
.slds-notify_toast,
.slds-notify--toast {
  @include inverse-text;
  display: inline-flex;
  align-items: center;
  position: relative;
  background: none; // reset
  background-color: var(--slds-c-toast-color-background, var(--sds-c-toast-color-background, var(--slds-g-color-neutral-base-50, #{$color-background-toast})));
  color: var(--slds-c-toast-text-color, var(--sds-c-toast-text-color));
  border-radius: var(--slds-c-toast-radius-border, var(--sds-c-toast-radius-border, $border-radius-medium));
  margin: $spacing-x-small;
  padding-top: var(--slds-c-toast-spacing-block-start, var(--slds-c-toast-spacing-blockstart, var(--sds-c-toast-spacing-block-start, $spacing-small)));
  padding-right: var(--slds-c-toast-spacing-inline-end, var(--slds-c-toast-spacing-inlineend, var(--sds-c-toast-spacing-inline-end, $spacing-xx-large)));
  padding-bottom: var(--slds-c-toast-spacing-block-end, var(--slds-c-toast-spacing-blockend, var(--sds-c-toast-spacing-block-end, $spacing-small)));
  padding-left: var(--slds-c-toast-spacing-inline-start, var(--slds-c-toast-spacing-inlinestart, var(--sds-c-toast-spacing-inline-start, $spacing-large)));
  min-width: var(--slds-c-toast-sizing-min-width, var(--slds-c-toast-sizing-width-min, var(--sds-c-toast-sizing-min-width, rem(480px))));
  text-align: left;
  justify-content: flex-start;

  /**
   * @summary Alert close button
   * @selector .slds-notify__close
   * @restrict .slds-notify_toast div
   */
  .slds-notify__close {
    float: right;
    position: absolute;
    top: $spacing-small;
    right: $spacing-small;
    margin-left: $spacing-xx-small;
    transform: none;
  }

  .slds-notify__content a:focus {
    box-shadow: var(--slds-g-shadow-outset-focus-1, #{$shadow-button-focus});
    border-color: transparent;
  }
}

// Modify toasts when in a narrow column
.slds-region_narrow {

  // Modifying .slds-notify--toast when inside a region with the
  // class .slds-region--narrow
  .slds-notify_toast,
  .slds-notify--toast {
    min-width: auto;
    width: 100%;
    margin-left: 0;
  }
}
